const path = require("path");
function resolve(dir) {
  return path.join(__dirname, dir);
}
const Timestamp = new Date().getTime();
module.exports = {
  publicPath: "/",
  outputDir: "dist",
  assetsDir: "static",
  indexPath: "index.html",
  filenameHashing: true,
  productionSourceMap: false,
  devServer: {
    hot: true,
    port: 8055,
    proxy: {
      "/api": {
        target: "https://35b178359r.goho.co", //自己实际接口请求地址
        changeOrigin: true,
        pathRewrite: {
          "^/api": "",
        },
      },
    },
  },
  css: {
    sourceMap: false,
    loaderOptions: {
      // 你的基础样式 因为没有我就注释了
      // sass: {
      //     data: `
      //      @import "@/assets/style/base.scss";
      //  `,
      // },

      //这只主题样式，修改此文件后需要重新启动，
      less: {
        lessOptions: {
          modifyVars: {
            //这是配置css主题色
            "primary-color": "#007AFF",
          },
          javascriptEnabled: true,
        },
      },
    },
    // 每次打包后生成的css携带时间戳
    extract: {
      filename: `css/[name].${Timestamp}.css`,
      chunkFilename: `css/[name].${Timestamp}.css`,
    },
  },
  configureWebpack: {
    //每次打包后生成的js携带时间戳
    output: {
      filename: `[name].${Timestamp}.js`,
      chunkFilename: `[name].${Timestamp}.js`,
    },
  },
  chainWebpack: (config) => {
    //删除预加载 提升编译速度
    config.plugins.delete("prefetch");
    config.plugins.delete("preload");

    //svg配置
    config.module.rules.delete("svg"); // 重点：删除默认配置中处理svg,
    // 添加新的SVG处理规则
    config.module
      .rule("svg")
      .test(/\.svg$/)
      .include.add(path.resolve(__dirname, "src/assets/icons/svg")) // 处理SVG目录
      .end()
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({
        symbolId: "icon-[name]",
      });

    // 添加SVGO优化配置（可选）
    config.module
      .rule("svgo")
      .test(/\.svg$/)
      .include.add(path.resolve(__dirname, "src/assets/icons/svg")) // 处理SVG目录
      .end()
      .use("svgo-loader")
      .loader("svgo-loader");
  },
  pluginOptions: {
    // 可以在这里添加 Vue CLI 插件的配置选项
  },
};
